<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
<style type="text/css">
table tr th{
    color:white;
    background-color: rgb(93, 213, 200);
    width: 150px;
    height: 30px;
}
table td{
    width: 150px;

}
table td a{
    text-decoration: none;
}
table{
    text-align: center;
}
</style>
</head>
<body>

<!--<div>-->
<!--    <table>-->
<!--    <tr >-->
<!--    <th>款式编码</th>-->
<!--    <th>库存</th>-->
<!--    </tr>-->
<!--    {% for line in page_obj %}-->
<!--    <tr>-->
<!--        <td>{{line.number}}</td>-->
<!--        <td>{{line.tory}}</td>-->
<!--    </tr>-->
<!--    {% endfor %}-->
<!--</table>-->
<!--</div>-->

<div class="pages">
    <ul>
        {# 首页按钮，固定page=1 #}
        <li><a href='?page=1'>首页</a></li>
        {# 如果上一页还有数据，那么让其可继续点击进入上一页 #}
        {% if page_number.has_previous %}
            <li><a href="?page={{ page_obj.previous_page_number }}" >上一页</a>
            </li>
            {# 如果上一页没有数据了，那么不让做任何操作 #}
        {% else %}
        {% endif %}

        {% for page in paginator.num_pages %}
            {% if page %}
                {% if equal page page_obj.number %}
                    <a href="?{{ page.querystring }}"><span>{{ page }}</span></a>
                {% else %}
                    <a href="?{{ page.querystring }}" >{{ page }}</a>
                {% endifequal %}
            {% else %}
                <a href="">...</a>
            {% endif %}
        {% endfor %}

        {# 如果当前页还有下一页，那么让其可以点击进入下一页 #}
        {% if page_obj.has_next %}
            <li><a href="?page={{ page_obj.next_page_number }}" >下一页</a></li>
        {% endif %}

        {# 跳转到尾页，让page参数直接等于总页数 #}
        <li><a href='?page={{ paginator.num_pages }}'>尾页</a></li>
    </ul>
</div>
</body>
</html>
